import React from "react";
import { Space, Button, Form, Select, Input } from "antd";
import "./filterComponent.scss";
import { businessTypeOptions } from "./../../pages/company/company.config";

/**
 * 顶栏搜索组件
 *
 * reload 刷新
 * add 添加
 * del 删除
 * filterFinish 搜索
 * resetFilter 重置
 */
export default (props) => {
  const [formFilter] = Form.useForm();

  const resetFilter = () => {
    // 组件本身UI层面的数据重置
    formFilter.resetFields();
    props.resetFilter && props.resetFilter();
  };

  return (
    <div className="filter-box">
      <Space>
        <Button type="primary" onClick={() => props.reload && props.reload()}>
          刷新
        </Button>
        <Button type="primary" onClick={() => props.add && props.add()}>
          新增
        </Button>
        <Button
          onClick={() => props.del && props.del()}
          disabled={!props.delIds || props.delIds.length === 0}
        >
          删除
        </Button>
        <Form
          form={formFilter}
          layout="inline"
          onFinish={(value) => props.filterFinish && props.filterFinish(value)}
        >
          {props.children}
          <Form.Item name="keyWord">
            <Input></Input>
          </Form.Item>
          <Button type="primary" htmlType="submit">
            搜索
          </Button>
          <Button htmlType="button" onClick={resetFilter}>
            重置
          </Button>
        </Form>
      </Space>
    </div>
  );
};
